<html>

	<head>
		<meta charset="utf-8">
		<title>掌上工单</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" href="../css/common.css" />	
		<link rel="stylesheet" href="../css/common_article.css" />
		<style>
			.mui-bar{
				background-color: rgba(0,153,204,.9);
			}
			.mui-icon{
				color: #FFFFFF;
			}
		</style>
	</head>
	
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title" style="color: #FFFFFF;">任务详情</h1>
		</header>
		<div class="mui-content">
			<div class="mui-content-padded" id="task-content">
			</div>
			<div class="hr-40"></div>
			<div class="mui-content-padded" id="btn-detail">
				<!--<button class="mui-btn mui-btn-block mui-btn-primary accept">接受</button>
				<button class="mui-btn mui-btn-block mui-btn-danger refuse">拒绝</button>
				<button class="mui-btn mui-btn-block mui-btn-success complete">完成</button>-->
			</div>
			<div class="hr-20 mui-clearfix"></div>
			<div>
				<img src="" id="head-img"/>				
			</div>
		</div>
	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/mui.zoom.js"></script>
	<script src="../js/mui.previewimage.js"></script>
	<script>
		function getQueryString(name)
		{
		     var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
		     var r = window.location.search.substr(1).match(reg);
		     if(r!=null)return  unescape(r[2]); return null;
		}
		var taskId = 0,dataType='';
		mui.previewImage();
		mui.plusReady(function() {
			mui.toast(window.location.href) ;
			taskId = getQueryString("taskId") ;
			dataType = getQueryString("dataType");
			//mui.toast(dataType);
			var content = '';
			if('unaccept'==dataType){
				content += '<button class="mui-btn mui-btn-block mui-btn-primary accept">接受</button>';
				content += '<button class="mui-btn mui-btn-block mui-btn-danger refuse">拒绝</button>';
			}else if('goingon' == dataType){
				content += '<button class="mui-btn mui-btn-block mui-btn-primary complete">完成</button>';
				content += '<button class="mui-btn mui-btn-block mui-btn-danger delay">延时</button>';
			}else if('delay' == dataType){
				content += '<button class="mui-btn mui-btn-block mui-btn-primary complete">完成</button>';
			}else if('complete' == dataType){
				//content += '<button class="mui-btn mui-btn-block mui-btn-primary delete">删除</button>';
			}
			document.getElementById('btn-detail').innerHTML=content; 
			
			mui.getJSON('json/task-detail.json',{taskId:taskId},function(data){
				var detail = data.data;
				
				var detailInfo = '<h4 style="text-align: center;">{title}</h4>';
				detailInfo += '<small>联系人：{contact}</small><br />';
				detailInfo += '<small>联系电话：{telphone}</small><span onclick="plus.device.dial( {tel}, true );" class="mui-icon mui-icon-phone-filled primary"></span><br />';
				detailInfo += '<small>下发时间：{time}</small><br />';
				detailInfo += '<small>任务地址：{address}</small><br />';
				detailInfo += '<div class="hr-20"></div>';
				
				detailInfo = detailInfo.replace('{title}',detail.title);
				detailInfo = detailInfo.replace('{contact}',detail.contact);
				detailInfo = detailInfo.replace('{telphone}',detail.telphone);
				detailInfo = detailInfo.replace('{tel}',10086);
				detailInfo = detailInfo.replace('{time}',detail.time);
				detailInfo = detailInfo.replace('{address}',detail.address);
				detailInfo += detail.content ;
				document.getElementById('task-content').innerHTML = detailInfo;
				
			});
		});
		var aniShow = "pop-in";
		var btnArray = ['取消','确认']; 
		mui(".mui-content-padded").on("tap",".accept",function(event){
			mui.confirm('确认接受该任务？', '', btnArray, function(e) {
				if (e.index == 1) {//确定
					//var li = elem.parentNode.parentNode;
					//li.parentNode.removeChild(li);
				}
			});
		});
		mui(".mui-content-padded").on("tap",".refuse",function(event){
  			var href = 'refuse.html';
			var webview_style = {
				popGesture: "close"
			};
			mui.openWindow({
				id: 'refuse',
				url: href,
				styles: webview_style,
				show: {
					aniShow: aniShow
				},
				waiting: {
					autoShow: false
				}
			});
		});
		mui(".mui-content-padded").on("tap",".delay",function(event){
  			var href = 'delay.html';
			var webview_style = {
				popGesture: "close"
			};
			mui.openWindow({
				id: 'delay',
				url: href,
				styles: webview_style,
				show: {
					aniShow: aniShow
				},
				waiting: {
					autoShow: false
				}
			});
		});
		mui(".mui-content-padded").on("tap",".delete",function(event){
			btnArray = ['取消','确认'];
			mui.confirm('确认删除该任务？', '', btnArray, function(e) {
				if (e.index == 1) {//确定
					//var li = elem.parentNode.parentNode;
					//li.parentNode.removeChild(li);
				}
			});
		});
		mui(".mui-content-padded").on("tap",".complete",function(event){
  			var href = 'complete.html';
			var webview_style = {
				popGesture: "close"
			};
			mui.openWindow({
				id: 'complete',
				url: href,
				styles: webview_style,
				show: {
					aniShow: aniShow
				},
				waiting: {
					autoShow: false
				}
			});
		});
	</script>

</html>